<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>教育展示--投教视频</title>
    <link rel="stylesheet" href="{{$static_path}}/static/common/css/reset.css">
    <link rel="stylesheet" href="{{$static_path}}/static/common/css/swiper_2.7.css">
    <link rel="stylesheet" href="{{$static_path}}/static/common/css/header.css">
    <link rel="stylesheet" href="{{$static_path}}/static/common/css/footer.css">
    <link rel="stylesheet" href="{{$static_path}}/static/css/exhibition/list_exhibition-magazine.css">
    <link rel="stylesheet" href="{{$static_path}}/static/common/css/common.css">
    <script src="{{$static_path}}/static/common/js/jquery-1.11.3.js"></script>
</head>

<body>
    <!-- 头部部分 -->
    {{include file="header.tpl"}}
    <!-- 内容区域 -->
    <div class="dh-main">
        <div class="exhibition-banner"></div>
        <div class="main-content">
            <div class="main-left">
                <div class="dh-top1">
                    <p class="h-top">教育展示</p>
                </div>
                <ul class="dh-list">
                    {{navigation parentid="49"}}
                        {{foreach $list as $k => $v}}
                            <li> <a href="{{$v['url']}}">{{$v['name']}}</a></li>
                        {{/foreach}}
                    {{/navigation}}
                </ul>
            </div>
            <div class="main-right">
                <div class="right-txt-box">
                    <h1>电子杂志</h1>
                    <div class="wz">
                        <span class="wz-span">您的位置：<a href="">首页</a> > <a href="">教育展示</a> ><a href="">电子杂志</a> </span>
                    </div>
                </div>
                <div class="box-txt">
                    <div class="zs-tabs">
                        <p class="zs-acitve"> 中证协电子期刊</p>
                        <p>苏证协电子期刊</p>
                        <p>创意杂志专栏</p>
                    </div>
                    <!-- <source  src=""> -->
                   <div class="bd_content">
                    <ul class="list_banners">
                        <li>
                            <div>
                                <a href="detail_exhibition-warningcase.html">
                                    <img src="{{$static_path}}/static/images/list_exhibition-magazine/list_banner1.png" alt="">
                                </a>
                            </div>
                            <div>
                                <a href="detail_exhibition-warningcase.html">
                                    <img src="{{$static_path}}/static/images/list_exhibition-magazine/list_banner1.png" alt="">
                                </a>
                            </div>
                            <div>
                                <a href="detail_exhibition-warningcase.html">
                                    <img src="{{$static_path}}/static/images/list_exhibition-magazine/list_banner1.png" alt="">
                                </a>
                            </div>
                            <div>
                                <a href="detail_exhibition-warningcase.html">
                                    <img src="{{$static_path}}/static/images/list_exhibition-magazine/list_banner1.png" alt="">
                                </a>
                            </div>
                           
                        </li>
                        <li>
                            <div>
                                <a href="detail_exhibition-warningcase.html">
                                    <img src="{{$static_path}}/static/images/list_exhibition-magazine/list_banner1.png" alt="">
                                </a>
                            </div>
                            <div>
                                <a href="detail_exhibition-warningcase.html">
                                    <img src="{{$static_path}}/static/images/list_exhibition-magazine/list_banner1.png" alt="">
                                </a>
                            </div>
                            <div>
                                <a href="detail_exhibition-warningcase.html">
                                    <img src="{{$static_path}}/static/images/list_exhibition-magazine/list_banner1.png" alt="">
                                </a>
                            </div>
                            <div>
                                <a href="detail_exhibition-warningcase.html">
                                    <img src="{{$static_path}}/static/images/list_exhibition-magazine/list_banner1.png" alt="">
                                </a>
                            </div>
                        </li>
                        
                    </ul>

                     <!-- 分页 -->
                     <div class="dywPages">
                        
                    </div>
                </div>
                   </div>
                </div>


            </div>

        </div>


    </div>
    
    <!--放一个id为footer的div,把footer.html加载到这块-->
    {{include file="footer.tpl"}}
    <!-- 底部部分 -->

</body>

<!-- 加载头尾 -->

<script src="{{$static_path}}/static/common/js/load.js"></script>
<script src="{{$static_path}}/static/common/js/swiper_2.7.js"></script>
<script>

    var mySwiper = new Swiper('.swiper-containers', {
        autoplay: 5000,//可选选项，自动滑动
        // loop: true,//可选选项，开启循环
        paginationClickable: true,
        slidesPerView: 4,
        onInit: function (swiper) {
            swiper.swipeNext()
        }
    })
    $('#btn1').click(function () {
        mySwiper.swipePrev();


    })
    $('#btn2').click(function () {
        mySwiper.swipeNext();
    })

    // video切换
    $('.video-banner').click(function () {
        $(this).addClass('video-active').parent().siblings().children().removeClass('video-active')
        var playurl = $(this).data('banner');
    document.getElementById("videos").src=playurl ;
    $("#videos")[0].play();
    })

    $('.zs-tabs>p').click(function () {
        $(this).addClass('zs-acitve').siblings().removeClass('zs-acitve')
        $('.tabs1-active').eq($(this).index()).show().siblings().hide()
    })
    // 获取自定义属性

</script>

</html>